<div class="layui-form" lay-filter="layuiadmin-form-admin" id="layuiadmin-form-admin" style="padding: 20px 30px 0 0;">
    <div class="layui-row">
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
            <div class="layui-form-item">
                <label class="layui-form-label">选择工作流</label>
                <div class="layui-input-block">
                    <select name="flow_id" lay-verify="required" lay-search="">
                        <option value="">直接选择或搜索选择</option>
                        {foreach $flow as $vo}
                        <option value="{$vo.id}">{$vo.flowcode}-{$vo.flowname}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
            <div class="layui-form-item">
                <label class="layui-form-label">申请人</label>
                <div class="layui-input-block">
                    <input type="text" value="{$username ?? ''}" lay-verify="required"
                           placeholder="请输入申请人" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
            <div class="layui-form-item">
                <label class="layui-form-label">申请部门</label>
                <div class="layui-input-block">
                    <input type="text" value="{$group_name ?? ''}"
                           lay-verify="required" placeholder="请输入申请部门" autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
            <div class="layui-form-item">
                <label class="layui-form-label">申请日期</label>
                <div class="layui-input-block">
                    <input type="text" id="test1" name="now_time" lay-verify="required"
                           placeholder="请输入申请日期"
                           autocomplete="off"
                           class="layui-input" readonly>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
            <div class="layui-form-item">
                <label class="layui-form-label">类别</label>
                <div class="layui-input-block">
                    <select name="type_id" id="type_id" lay-verify="required" lay-search="" lay-filter="type">
                        <option value="">直接选择或搜索选择</option>
                        {foreach $apply_type as $vo}
                        <option value="{$vo.id}" {if condition="($type_id eq $vo.id)" }selected{/if}>{$vo.name}</option>
                        {/foreach}
                    </select>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div id="zhang" style="display: none">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label">用章类别</label>
                    <div class="layui-input-block">
                        <select name="name" id="name" lay-search="">
                            <option value="">直接选择或搜索选择</option>
                            <option value="公司章">公司章</option>
                            <option value="财务章">财务章</option>
                            <option value="合同章">合同章</option>
                            <option value="其他章">其他章</option>
                        </select>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label">用章事由</label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="yz_content"/>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div id="qian" style="display: none">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label">借款方式</label>
                    <div class="layui-input-block">
                        <input type="radio" name="jk_fs" value="现金" title="现金" checked>
                        <input type="radio" name="jk_fs" value="转账" title="转账">
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md6">
                <div class="layui-form-item">
                    <label class="layui-form-label">借款金额</label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="jk_money"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">收款名称</label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="sk_name"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">收款账号</label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="sk_zh"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md4">
                <div class="layui-form-item">
                    <label class="layui-form-label">收款开户行</label>
                    <div class="layui-input-block">
                        <input class="layui-input" name="sk_khh"/>
                    </div>
                </div>
            </div>
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label">借款用途</label>
                    <div class="layui-input-block">
                        <textarea class="layui-textarea" name="sk_content"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div id="che" style="display: none">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">
                        <table class="layui-table">
                            <thead>
                            <tr>
                                <th style="text-align: center;">起始地点</th>
                                <th style="text-align: center;">计划线路</th>
                                <th style="text-align: center;">开始时间</th>
                                <th style="text-align: center;">结束时间</th>
                                <th style="text-align: center;">用车天数</th>
                                <th style="text-align: center;">用车价格(天)</th>
                                <th style="text-align: center;">用车价格(总)</th>
                                <th style="text-align: center;">司机姓名</th>
                                <th style="text-align: center;">司机号码</th>
                                <th style="text-align: center;">用车人</th>
                                <th style="text-align: center;"></th>
                            </tr>
                            </thead>
                            <tbody id="che-index-table">
                            <tr>
                                <td>
                                    <input type="text" name="start_address[]" placeholder="起始地点"
                                           autocomplete="off"
                                           class="layui-input input num">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="plan_lx[]" placeholder="计划线路"
                                           autocomplete="off"
                                           class="layui-input input num">
                                </td>
                                <td style="text-align: center;"><input type="number " name="start_time[]"  placeholder="开始时间"
                                                                         autocomplete="off"
                                                                         class="layui-input input num"></td>
                                <td>
                                    <input type="text" name="end_time[]"  placeholder="结束时间"
                                           autocomplete="off"
                                           class="layui-input input num">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="day[]"  placeholder="用车天数"
                                           autocomplete="off"
                                           class="layui-input input num che_day">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="che_dj[]"  placeholder="用车单价"
                                           autocomplete="off"
                                           class="layui-input input num che_dj">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="che_zongjia[]"  placeholder="用车总价(合计)"
                                           autocomplete="off"
                                           class="layui-input input num che_zongjia">
                                </td>
                                <td style="text-align: center;"><input type="text " name="sj_name[]"  placeholder="司机姓名"
                                                                         autocomplete="off"
                                                                         class="layui-input input num"></td>
                                <td>
                                    <input type="text"  name="sj_phone[]" placeholder="司机号码"
                                           autocomplete="off"
                                           class="layui-input input num">
                                </td>

                                <td style="text-align: center;"><input type="text" name="ycr[]" placeholder="用车人"
                                                                         autocomplete="off"
                                                                         class="layui-input input num"></td>
                                <td></td>
                            </tr>

                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <div id="caigou" style="display: none">
            <div class="layui-col-xs12 layui-col-sm12 layui-col-md12">
                <div class="layui-form-item">
                    <label class="layui-form-label"></label>
                    <div class="layui-input-block">
                        <table class="layui-table">
                            <thead>
                            <tr>
                                <th style="text-align: center;">品名规格</th>
                                <th style="text-align: center;">数量</th>
                                <th style="text-align: center;">单价</th>
                                <th style="text-align: center;">总价</th>
                                <th style="text-align: center;">备注</th>
                                <th style="text-align: center;"></th>
                            </tr>
                            </thead>
                            <tbody id="index-table">
                            <tr>
                                <td>
                                    <select name="cg_guige[]" lay-search=""  id="select">
                                        <option value="">直接选择或搜索选择</option>
                                        {foreach $cg_type as $key=>$value}
                                        <option value="{$value.id}">{$value.name}-{$value.price}</option>
                                        {/foreach}
                                    </select>
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="cg_num[]" placeholder="请输入数量"
                                           autocomplete="off"
                                           class="layui-input input num cg_num">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="cg_dj[]" placeholder="请输入单价"
                                           autocomplete="off"
                                           class="layui-input input num cg_dj">
                                </td>
                                <td style="text-align: center;">
                                    <input type="text" name="cg_zongjia[]" placeholder="请输入总价"
                                           autocomplete="off"
                                           class="layui-input input num cg_zongjia">
                                </td>
                                <td style="text-align: center;"><input type="text" name="content[]"
                                                                       placeholder="请输入备注" autocomplete="off"
                                                                       class="layui-input"></td>
                                <td></td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit lay-filter="LAY-user-back-submit" id="LAY-user-back-submit" value="确认">
    </div>
</div>
<script src="/static/admin/video/jquery.js"></script>
<script src="/static/admin/layui/layui.js"></script>
<script>
    layui.config({
        base: '/static/admin/' //静态资源所在路径
    }).extend({
        index: 'lib/index', //主入口模块
    }).use(['index', 'upload', 'laydate', 'form'], function () {
        var $ = layui.$, form = layui.form, upload = layui.upload, laydate = layui.laydate;
        //常规用法
        laydate.render({
            elem: '#test1'
            , trigger: 'click'//呼出事件改成click
            , value: "{$time}"
            , type: 'datetime'

        });
        var arr = []; //金额数组
        var cg_arr = []
        if ($("#type_id option:selected").text() == "用章") {
            $('#zhang').show();
            $('#qian').hide();
            $('#che').hide();
            $('#caigou').hide();
        } else if ($("#type_id option:selected").text() == "借款") {
            $('#zhang').hide();
            $('#qian').show();
            $('#che').hide();
            $('#caigou').hide();
        } else if ($("#type_id option:selected").text() == "用车") {
            $('#zhang').hide();
            $('#qian').hide();
            $('#che').show();
            $('#caigou').hide();
        } else if ($("#type_id option:selected").text() == "采购") {
            $('#zhang').hide();
            $('#qian').hide();
            $('#che').hide();
            $('#caigou').show();
        } else {
            $('#zhang').hide();
            $('#qian').hide();
            $('#che').hide();
            $('#caigou').hide();
        }
        form.on('select(type)', function (data) {
            if ($("#type_id option:selected").text() == "用章") {
                $('#zhang').show();
                $('#qian').hide();
                $('#che').hide();
                $('#caigou').hide();
            } else if ($("#type_id option:selected").text() == "借款") {
                $('#zhang').hide();
                $('#qian').show();
                $('#che').hide();
                $('#caigou').hide();
            } else if ($("#type_id option:selected").text() == "用车") {
                $('#zhang').hide();
                $('#qian').hide();
                $('#che').show();
                $('#caigou').hide();
            } else if ($("#type_id option:selected").text() == "采购") {
                $('#zhang').hide();
                $('#qian').hide();
                $('#che').hide();
                $('#caigou').show();
            } else {
                $('#zhang').hide();
                $('#qian').hide();
                $('#che').hide();
                $('#caigou').hide();
            }
        });
        var select = $("#select").html();
        cg_html(select,form);


        $("body").on('click', '.addInputReturn', function () {
            var $content = "";
            $content += '<a href="javascript:;" class="delInput" >';
            $content += '<i class="layui-icon">&#x1006;</i>';
            $content += '</a>';
            $(this).parent().append($content);
            //去除加号
            this.remove();
            var html = "";
            html += "<tr>";
            html += "<td><select name=\"cg_guige[]\" lay-search=\"\">"
            html += select
            html += "</select>";
            html += "</td>";
            html += "<td> <input type=\"number \" name=\"cg_num[]\" placeholder=\"请输入数量\" autocomplete=\"off\"\n" +
                "                           class=\"layui-input input num cg_num\">";
            html += "</td>"
            html += "<td> <input type=\"number \" name=\"cg_dj[]\" placeholder=\"请输入数量\" autocomplete=\"off\"\n" +
                "                           class=\"layui-input input num cg_dj\">";
            html += "</td>"
            html += "<td> <input type=\"number \" name=\"cg_zongjia[]\" placeholder=\"请输入数量\" autocomplete=\"off\"\n" +
                "                           class=\"layui-input input num cg_zongjia\">";
            html += "</td>"
            html += "<td><input type=\"text\" name=\"content[]\"\n" +
                "placeholder=\"请输入备注\" autocomplete=\"off\"\n" +
                "class=\"layui-input\">";
            html += "</td>"
            html += "<td><i class=\"iconfont icon-xinzeng addInputReturn\" id=\"addTable\" style=\"cursor:pointer;\"></i>"
            html += "</td>"
            html += "</tr>"
            $("#index-table").append(html);
            form.render();
        });
        /**
         * 删除事件
         */
        $("body").on('click', '.delInput', function () {
            //获取当前点击的元素的父级的父级进行删除
            $(this).parent().parent().remove();
        });
        yc_html();
        $("body").on('click', '.yc_addInputReturn', function () {
            var $content = "";
            $content += '<a href="javascript:;" class="yc_delInput" >';
            $content += '<i class="layui-icon">&#x1006;</i>';
            $content += '</a>';
            $(this).parent().append($content);
            //去除加号
            this.remove();
            yc_html();
        });
        /**
         * 删除事件
         */
        $("body").on('click', '.yc_delInput', function () {
            //获取当前点击的元素的父级的父级进行删除
            $(this).parent().parent().remove();
        });
        //文本框焦点
        $('body').on('blur', '.input', function () {
            var value = $(this).val();
            if (value != null && value != '') {
                var num = $(this).parents("tr").find("input.che_day").val();
                var price = $(this).parents("tr").find("input.che_dj").val();
                var final = num * price;
                if (final != 0) {
                    arr.push(final);
                }

                $(this).parents("tr").find("input.che_zongjia").val(final);
                var total = eval(arr.join("+"));
                $('#total').text(total);
            }
        });

        //文本框焦点
        $('body').on('blur', '.input', function () {
            var value = $(this).val();
            if (value != null && value != '') {
                var num = $(this).parents("tr").find("input.cg_num").val();
                var price = $(this).parents("tr").find("input.cg_dj").val();
                var final = num * price;
                if (final != 0) {
                    cg_arr.push(final);
                }

                $(this).parents("tr").find("input.cg_zongjia").val(final);
                var total = eval(cg_arr.join("+"));
                $('#total').text(total);
            }
        });
        //验证规则
        function validateInput(value) {
            var regex = /^(\d{1,10}|100000)$/;
            if (!regex.test(value)) {
                layer.msg("请填写0~100000的数字，包含0和100000", {icon: 2});
                return false;
            }
            return true;
        }
    });
    function yc_html() {
        var yc_html = "";
        yc_html += "<tr>";
        yc_html+="  <td>\n" +
            "         <input type=\"text \" name=\"start_address[]\"  placeholder=\"起始地点\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\">\n" +
            "         </td>";
        yc_html+="<td style=\"text-align: center;\">\n" +
            "         <input type=\"text \" name=\"plan_lx[]\"  placeholder=\"计划线路\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\">\n" +
            "         </td>";
        yc_html+="   <td style=\"text-align: center;\"><input type=\"text \" name=\" []\"  placeholder=\"开始时间\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\"></td>";
        yc_html+="<td>\n" +
            "         <input type=\"text \" name=\"end_time[]\"  placeholder=\"结束时间\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\">\n" +
            "         </td>";
        yc_html+="  <td style=\"text-align: center;\">\n" +
            "         <input type=\"text \"  name=\"day[]\"  placeholder=\"用车天数\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num che_day\">\n" +
            "         </td>";

        yc_html+="  <td style=\"text-align: center;\">\n" +
            "         <input type=\"text \"  name=\"che_dj[]\"  placeholder=\"用车单价\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num che_dj\">\n" +
            "         </td>";
        yc_html+="  <td style=\"text-align: center;\">\n" +
            "         <input type=\"text \"  name=\"che_zongjia[]\"  placeholder=\"用车总价\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num che_zongjia\">\n" +
            "         </td>";

        yc_html+="  <td style=\"text-align: center;\"><input type=\"text \" name=\"sj_name[]\" placeholder=\"司机姓名\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\">" +
            "         </td>";
        yc_html+=" <td>\n" +
            "         <input type=\"text \" name=\"sj_phone[]\" placeholder=\"司机号码\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\">\n" +
            "         </td>";
        yc_html+=" <td style=\"text-align: center;\"><input type=\"text \" name=\"ycr[]\"  placeholder=\"用车人\"\n" +
            "         autocomplete=\"off\"\n" +
            "         class=\"layui-input input num\"></td>";
        yc_html += "<td><i class=\"iconfont icon-xinzeng yc_addInputReturn\" id=\"addTable\" style=\"cursor:pointer;\"></i>"
        yc_html += "</td>"
        yc_html+="</tr>";
        $("#che-index-table").append(yc_html);
    }
    function cg_html(select,form) {

        var html = "";
        html += "<tr>";
        html += "<td><select name=\"cg_guige[]\" lay-search=\"\">"
        html += select
        html += "</select>";
        html += "</td>";
        html += "<td> <input type=\"text \" name=\"cg_num[]\" placeholder=\"请输入数量\" autocomplete=\"off\"\n" +
            "                           class=\"layui-input input num cg_num\">";
        html += "</td>"
        html += "<td> <input type=\"text \" name=\"cg_dj[]\" placeholder=\"请输入单价\" autocomplete=\"off\"\n" +
            "                           class=\"layui-input input num cg_dj\">";
        html += "</td>"
        html += "<td> <input type=\"text \" name=\"cg_zongjia[]\" placeholder=\"请输入总价\" autocomplete=\"off\"\n" +
            "                           class=\"layui-input input num cg_zongjia\">";
        html += "</td>"
        html += "<td><input type=\"text\" name=\"content[]\"\n" +
            "placeholder=\"请输入备注\" autocomplete=\"off\"\n" +
            "class=\"layui-input\">";
        html += "</td>"
        html += "<td><i class=\"iconfont icon-xinzeng addInputReturn\" id=\"addTable\" style=\"cursor:pointer;\"></i>"
        html += "</td>"
        html += "</tr>"
        $("#index-table").append(html);
        form.render();
    }



</script>
